<template>
  <div>
    <tableTool style="margin: 0 30px 0 29px" />
    <el-table
      :data="dialogTableData"
      border
      style="width: 661px; margin: 0 29px"
    >
      <el-table-column prop="id" width="50" align="center"></el-table-column>
      <el-table-column prop="operator" label="操作人" width="120" sortable>
      </el-table-column>
      <el-table-column prop="role" label="角色" width="120" sortable>
      </el-table-column>
      <el-table-column
        prop="operationTime"
        label="操作时间"
        width="120"
        show-overflow-tooltip="true"
        sortable
      ></el-table-column>
      <el-table-column
        prop="operationType"
        label="操作类型"
        width="130"
        sortable
      >
      </el-table-column>
      <el-table-column prop="history" label="历史记录" width="120">
        <el-button type="mini">查看详情</el-button>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <div class="page">
      <el-pagination
        :page-sizes="[10, 20, 30, 40]"
        :page-size="10"
        :pager-count="5"
        background
        layout="prev, pager, next, jumper,sizes, total"
        :total="400"
      >
      </el-pagination>
    </div>
  </div>
</template>

<script>
import tableTool from '@/components/Function/TableTool.vue';

export default {
  components: { tableTool },

  data() {
    return {
      // 对话框表格信息
      dialogTableData: [
        {
          id: 1,
          operator: '测试教师0922',
          role: '指导教师',
          operationTime: '2022-09-22 20:53:20',
          operationType: '提交',
        },
        {
          id: 2,
          operator: '测试教师0912',
          role: '系主任',
          operationTime: '2022-09-23 21:23:46',
          operationType: '提交',
        },
        {
          id: 3,
          operator: '测试教师0932',
          role: '评阅教师',
          operationTime: '2022-09-24 18:51:24',
          operationType: '提交',
        },
      ],
    };
  },
};
</script>

<style lang="less" scoped>
.page {
  width: 649px;
  margin: 0 29px 20px;
  padding: 5px !important;
  border: 1px solid #ebeef5;
}
</style>
